@font-face {
  font-family: 'Roboto';
  src: url('http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic');
}
/**************** BODY ************/
body
{
	background-color: #FFFFFF;
	font-family: Roboto, sans-serif;
	color: #000000;
	text-decoration: none;
	padding: 0px 5% 0px 5%;
}
/**************** MENU-LATERAL ************/
#navlist {
    float: right;
	position: fixed;
	margin-top: 12em;
	width: 10%;
	height: 100%;
	margin-right: 0.2em;
}
#navlist ul {
    list-style: none;
}
#navlist li a{
	display: block;
    height: 2em;
    width: 100%;
    padding: 1em;
    margin-bottom: 0.2em;
    background: #006633;
    color: #FFFFFF;
    font-size: 0.8em;
	font-weight: bold;
	text-align: right;
	text-decoration: none;
}
#navlist li a:hover {
    color: #006633;
    background: #FFFFFF;
    border-right: 0.2em solid #006633;
}
#navlist li  a:active {
    background: #006633;
    color: #FFFFFF;
    border-right: 0.2em solid #CC7A00;
}
/**************** DATOS-ARRIBA ************/
#subheader
{
	float: left;
	height: 1.5em;
	width: 100%;
	/*background-color: #001F0F;*/
	color: #CCE0D6;
	top: 0px;
	padding-top: 0.4em;
}
#subheader #lang{
	float: right;
	margin-right: 1em;
}
#subheader #lang img{
	width: 1.5em;
	height: 1.5em;
}
#subheader #datos{
	float: left;
	font-size: 0.8em;
}
#subheader #datos img{
	width: 1.3em;
	height: 1.3em;
}
#subheader #datos a{
	padding-right: 0.5em;
	padding-left: 0.5em;
}
#subheader #datos a:hover{
	color: #FFFFFF;
}
/**************** FOOTER ************/
#footer{
	background-color: #001F0F/*#CCE0D6*/;
	width: 100%;
	height: 100%;
	float:left;
	left: 0px;
	bottom: 0px;
	margin-top: 1.8em;
	border-radius: 4px;
	padding: 2em 1em;
}
#footer p, #footer a{
	text-align: center;
	text-decoration: none;
	color: #FFFAE6 /*#292D2B*/;
	font-size: 1em;
}
#footer #datos{
	float: none;
}
#footer #afip{
	float: right;
}
#footer p img{
	width: 1em;
	height: 1em;
}
@media screen and (max-width:800px ) {
	#footer #datos, #footer #afip{
		float: left;
	}
	#footer p {
		text-align: left;
	}	
}
/**************** MENU-CONTENIDOS ************/
#index {
	margin-right: 0px;
	list-style: none;
	list-style-image: url("../images/logoinfocom_solo.png");
    list-style-type: none;
    float: left;
    width: 98%;
}
#index li
{
	margin-bottom: 0.2em;
}
#index li a{
    color: #006633;
    font-size: 0.8em;
	font-weight: bold;
	text-decoration: none;
}
#index li a:hover {
    color: #006633;
    background: #FFFFFF;
    border-right: 0.2em solid #006633;
}
#index li a:active {
    background: #006633;
    color: #FFFFFF;
    border-right: 0.2em solid #CC7A00;
}
/**************** MENU-CONTENIDOS-WIKI ************/
#index2 {
	margin-right: 0px;
	list-style: none;
    list-style-type: none;
    float: left;
    width: 98%;
}
#index2 li.wiki
{
	margin-bottom: 5px;
	border: 2px solid #D1CFCD;
	width: 98%;
	height: 2em;
	vertical-align: center;
	padding: 1em 0em 1em 0em ;
}
#index2 li a{
    color: #929190;
    font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	cursor: pointer;
}
#index2 li a hover {
    color: #006633;
    background: #FFFFFF;
    border-right: 4px solid #006633;
}
#index2 li a:active {
    background: #006633;
    color: #FFFFFF;
    border-right: 4px solid #CC7A00;
}
/**************** TEXTO ****************/
a {
	text-decoration: none;
	color: #006633;
}
a.naranja
{
	text-decoration: underline;
	color: #006633;
	font-size: 1em;
}
.texto
{
	text-decoration: none;
	font-size: 1em;
}
.error
{
	text-decoration: none;
	color: #CC0000;
	font-size: 0.8em;
}
/**************** PARAGRAPH ************/
p
{
	text-decoration: none;
	text-align: justify;
	padding-left: 2em;
	padding-right: 2em;
	font-size: 1em;
	color: #000000;
}
p.normal_gris
{
	color: #292D2B;
}
p.normal_blanco
{
	color: #FFFFFF;
}
p.normal_naranja
{
	color: #006633;
}
.letrachica
{
	font-size: 0.8em;
}
span.titulo_naranja{
	color: #006633;
	font-weight: bold;
}
span.titulo_negro{
	color: #000000;
	font-weight: bold;
}
/**************** TITULOS ************/
h1{
	text-decoration: none;
	font-family: Roboto, sans-serif;
	font-size: 1.6em;
}
h1.titulo_gris
{
	color: #292D2B;
}
h1.titulo_naranja
{
	color: #006633;
}
h2{
	text-decoration: none;
	font-family: Roboto, sans-serif;
	font-size: 1.4em;
}
h2.titulo_naranja
{
	color: #006633;
}
h2.titulo_negro
{
	color: #000000;
}
h2.titulo_gris
{
	color: #292D2B;
}
h3{
	text-decoration: none;
	font-size: 1.3em;
}
h3.titulo_naranja
{
	color: #006633;
}
h3.titulo_negro
{
	color: #000000;
}
h4{
	text-decoration: none;
	font-size: 1em;
}
h4.titulo_negro
{
	color: #000000;
}
/**************** IMAGENES ************/
img {
	border: none;
}
img.ancho_100
{
	width: 100%;
}
img.afip{
	height: 8em;
}
/**************** SECCIONES ************/
div{
	float: left;
}
div.map{
	width: 100%;
	height: 400px;
	margin-bottom: 1em;
	/*background-image: url('http://maps.googleapis.com/maps/api/staticmap?markers=Sarmiento%201953,Buenos%20Aires,Argentina&zoom=15&size=640x400&sensor=false');
	background-repeat: no-repeat;*/
}
div.gris_medio, div.gris_todo {
	background-color: #CCE0D6;
	border-radius: 8px;
	float:left;
	text-align: center;
	margin-bottom: 1em;
}
div.gris_medio {
	margin-left: 1em;
	padding: 1em;
}
div.gris_medio a {
	float : left;
	margin-right : 1em;
}
div.gris_todo
{
	width: 100%;
	height: auto;
	margin: 0.2em 0px 0.2em 0px;
}
div.main
{
	width: 82%; 
	height: 75%;
}
div.seccion{
	width: 100%;
	margin-bottom: 2em;
}
div.ancho_100{
	width: 100%;
	margin-bottom: 2em;
}
div.ancho_70{
	width: 100%;
	margin-bottom: 2em;
}
div.seccion table{
	width: 100%;
}
div.seccion td{
	height: 2em;
}
div.sidebar{
	float: right;
	width: 20%;
}

@media screen and (max-width:800px ) {
	div.sidebar{
		float: left;
		width: 100%;	
	}	
}
/**************** TIPS-WARNINGS ************/
div.verde
{
	background: #EBFAEB;
	border:1px solid #2EB82E;
    padding:5px;
	border-radius: 8px;
	width: 99%; 
	height: auto;
	margin: 5px 0px 5px 0px;
}
div.amarillo
{
	background: #FFFAE6;
	border:1px solid #FFCC00;
    padding:5px;
	border-radius: 8px;
	width: 99%; 
	height: auto;
	margin: 5px 0px 5px 0px;
}
div.borde_gris
{
	background: #FFFFFF;
	border:1px solid #B8B8BE;
    padding:5px;
	border-radius: 8px;
	width: 95%; 
	height: auto;
	margin: 5px 0px 5px 0px;
}
/**************** TABLAS ************/
table
{
	background-color: #CCE0D6;
	border: #858585 solid 1px;
	border-radius: 8px;
}
th
{
	height: 1.2em;
}
td li
{
	font-size: 0.8em;
}
td.centrar{
	text-align: center;
}
table.gris
{
	background-color: #CCE0D6;
	padding:3em;
	border-radius: 8px;
	margin-bottom: 1em;
	font-size: 1.2em;
}
table.gris tr{
	height: 190px;
}
table.gris td{
	width: 50%;
}
table.gris img{
	width: 50%;/*200px;*/
	height: auto;
}
table.gris_bordes
{
	background-color: #CCE0D6;
	width: 90%;
	padding: 3%;
	border: #000000 solid 1px;
	border-radius: 8px;
	margin-bottom: 1em;
	font-size: 1em;
}
td.gris_bordes
{
	border: #858585 solid 1px;
	padding: 0.2em;
}
td.gris_bordes li
{
	font-size: 1em;
}
/**************** LISTAS ************/
ul ol{
	margin-right: 0px;
	list-style: none;
	list-style-image: none;
    list-style-type: circle;
    float: left;
    width: 95%;
}
li
{
	margin-bottom: 0.5em;
	font-size: 1em;
}
ul.nada{
	list-style: none;
}
/**************** FORMULARIO ************/
label {
    display: block;
    margin-top: 1.2em;
    letter-spacing: 1px;
	font-size: 0.8em;
}
.formulario {
    display: block;
    margin: 0 auto;
    width: 100%;
    color: #000000;
}
form {
    margin: 0 auto;
    width: 100%;
}
input, textarea {
    width: 30%;
    height: 1.1em;
    background: #FFFFFF;
    border: 0.1em solid #006633;
    padding: 10px;
    margin-top: 0.2em;
    font-size: 0.8em;
    color: #000000;
	border-radius: 8px;
}
textarea {
    height: 7em;
}
input.angosto{
	width: 10%;
}
#submit{
    display: block;
    height: 3em;
    width: 8em;
    padding: 0.6em;
    margin-bottom: 0.2em;
    background: #006633;
    color: #FFFFFF;
    font-size: 0.8em;
	font-weight: bold;
	cursor:pointer;
	border-radius: 8px;
}
#submit:hover {
    color: #006633;
    background: #FFFFFF;
    border-right: 0.1em solid #006633;
}
#submit:active {
    background: #006633;
    color: #FFFFFF;
    border-right: 0.1em solid #CC7A00;
}
/************ BOTONES *************************/
.boton{
    height: 2em;
    width: 15em;
    padding: 0.5em;
    margin: 0.2em;
    background: #006633;
    color: #FFFFFF;
    font-size: 0.9em;
	cursor:pointer;
	border-radius: 8px;
}
.boton:hover {
    color: #006633;
    background: #FFFFFF;
    border: 0.1em solid #006633;
}
.boton:active {
    background: #006633;
    color: #FFFFFF;
    border: 0.1em solid #CC7A00;
}
a.ver_mas{
	margin: 1em;
	padding: 0.75em;
	background-color: #006633;
	color: #FFFFFF;
	border: none;
	border-radius: 4px;
	float: right;
	cursor: pointer;
}
/************ DESTACADOS/HABITACIONES *************************/
#destacados, #noticias, #promos{
	height: 22em;
	width: 100%;
	border-top: 1px solid #006633;
	padding-left: 1%;
	margin-top: 1px;
}
#habitaciones {
	padding-left: 1%;
	margin-bottom: 1em;
}
#noticias, #promos{
	border: none;
	height: auto;
	margin-bottom: 1em;
}
#destacados h3, #habitaciones h3 {
	margin-top: 0px;
}
#destacados div, #habitaciones .habitacion{
	width: 30%;
	height: 15em;
	margin-right: 3%;
}
#noticias div, #promos div{
	width: 30%;
	margin-right: 3%;
}
#habitaciones .habitacion {
	margin: 3em 1em 3em 0em;
}
#destacados .info, #habitaciones .info{
	position: absolute;
	width: 25em;
	height: 15em;
	border-radius: 4px;
	padding: 1.2em;
	color: #006633;
	font-size: 0.8em;
}
#noticias .texto{
	color: #000000;
	font-size: 0.8em;
}
#destacados .info button, #habitaciones .info button{
	margin-top: 1em;
	width: 100%;
	background-color: #006633;
	color: #FFFFFF;
	border: none;
	border-radius: 4px;
}
#destacados .info button:hover, #habitaciones .info button:hover, a.ver_mas:hover{
	background-color: #001F0F;	
}
#destacados .mas_info, #noticias img, #destacados .img {
	position: relative;
	top: 0px;
	width: 90%;
	height: 100%;
	border-radius: 4px;
	cursor: pointer;
}
#promos img{
	max-height: 15em;
	max-width: 100%; 
}
#noticias img{
	cursor: auto;
	height: 15em;
	width: auto;
	max-width: 100%;
}
#habitaciones .mas_info {
	position: relative;
	top: 0px;
	height: 100%;
	border-radius: 4px;
	cursor: pointer;
}

@media screen and (max-width:800px ) {
	#noticias div, #promos div{
		width: 100%;
	}
	#destacados{
		height: auto;
	}
	#destacados div, #habitaciones .habitacion{
		width: 100%;
		float: left;
		height: 22em;
	}
	#destacados .mas_info{
		display: none;
	}
	#destacados .img{
		width: auto;
		height: 80%;
	}
}

/************ OPINIONES *************************/
#opiniones{
	width: 70%;
	margin-top: 1em;
}
#opiniones .opinion{
	margin-bottom: 1em;
	background-color: #CCE0D6;
	border: 1px solid #B5BDB8;
	border-radius: 4px;
	padding: 1em;
}
#opiniones .autor {
	width: 20%;
	border-radius: 4px;
}
#opiniones .comentario {
	width: 70%;
}
#opiniones p{
	padding: 0 0 0 0;
}
@media screen and (max-width:800px ) {
	#opiniones{
		width: 100%;
	}
}
/************ VENTANA MODAL *************************/
.modal{
	position: fixed;
	width: 100%;
	height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
    background: rgba(0,0,0,0.8);
    z-index: 99999;
    opacity: 0;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none;
}
.modal:target {
    opacity: 1;
    pointer-events: auto;
}
.modal .modalwin{
    width: 20em;
    position: relative;
    padding: 0.5em 1em 1em 1em;
    background: #fff;
    border-radius: 3px;
    -webkit-transition: all 500ms ease-in;
    -moz-transition: all 500ms ease-in;
    transition: all 500ms ease-in;
    
    margin: 10% auto;
    width:0;
    height:0;
}
.modal:target .modalwin{
    width: 50%;
    height: 75%;
    margin-left: 25%;
}
.modal .modalwin img{
	max-height: 50%;
}
iframe
{
	border: none;
	margin-right: 2%;
}